<template>
  <div class="echarts">
    <div  :id="id" :class="className" :style="{width: width, height: height}"></div>
  </div>
</template>

<script>
import echarts from "echarts";
import { setTimeout } from 'timers';
export default {
  props: {
    className: String,
    id: String,
    labelWidth: String,
    width: String,
    height: String,
    item: Array,
    arr:Array
  },
  data() {
    return {
       
    };
  },

  mounted(){
    // setTimeout(()=>{
    //   this.drawLine();
    // },1000)
  },
  methods: {
    drawLine(){
        // 基于准备好的dom，初始化echarts实例
       let myChart = echarts.init(document.getElementById(this.$props.id));

        // 绘制图表
        myChart.setOption({
            // title: { text: '在Vue中使用echarts' },
            tooltip: {
              show:false
            },
            xAxis: {
                data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子","裤子","高跟鞋","袜子"],
                show:false
            },
            yAxis: {
              show:false
            },
            series: [{
                // name: '销量',
                // type: 'bar',
                data: this.$props.arr,
                 type: 'line',
                  smooth: true,
                  symbol:'none',
                  lineStyle:{
                    normal:{
                      color:"rgba(103, 222, 120, 1)"
                    }
                  }
            }]
        });
    }
  }
};
</script>
